<template>
  <!-- 弹出层 -->
  <el-dialog title="" :visible.sync="dialogVisible" :modal="false" center :append-to-body="true" :show-close="true" width="100%" class="dialog_content" top="0">
    <div class="notice_content">
      <h3 class="notice_title cw">{{content.name}}</h3>
      <small class="created_time cw">{{content.createTime}}</small>
      <div class="mt30 cw" v-html="content.content">
      </div>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" class="fr mainColor" type="primary">关 闭</el-button>
      </span> -->
    </div>
  </el-dialog>
</template>

<script>
export default {
  data () {
    return {
      dialogVisible: false,
      content: {name: '', content: '', createTime: ''}
    }
  },
  methods: {
    show (info) {
      this.content = info
      this.dialogVisible = true
    }
  }
}
</script>

<style scoped>
.el-dialog--center .el-dialog__bod{padding: 0;}
.dialog_content{
  width: 50%;
  max-height: 30vh;
  background: rgba(0,5,46,1);
  overflow: scroll;
  opacity:0.9;
  position: fixed;
  top: 10%;
  left: 25%;
  color: white;
}
.notice_title {
  margin-top: -20px;
  text-align: center;
}
.created_time {
  text-align: right;
  float: right;
}
.fr{
    float: right;
    margin: 10px;
}
.mainColor{
    background: #2a2aedff;
    color: white;
    width: 50px;
    border: none;
    padding: 5px 10px;
}

.dialog_content::-webkit-scrollbar {/*滚动条整体样式*/
        width: 5px;     /*高宽分别对应横竖滚动条的尺寸*/
        height: 0.2px;
        z-index: 100;
}
.dialog_content::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
        border-radius: 10px;
         -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        background: #04C0E2FF;
}
.dialog_content::-webkit-scrollbar-track {/*滚动条里面轨道*/
        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        border-radius: 10px;
        background: rgba(6, 7, 107, 0.59);

}
</style>
